<!--
 * @Author: xfworld
 * @Date: 2020-06-10 15:26:04
 * @LastEditors: xfworld
 * @LastEditTime: 2020-06-11 17:10:03
 * @Description:
-->
<template>
    <div class="scanner">
        <van-nav-bar title="B2C交接" left-text="返回" @click-left="onClickLeft"></van-nav-bar>
        <van-row type="flex" justify="center">
            <van-col span="24">
                <van-form class="common-form">
                    <van-field is-link label="业务类型" v-model="formItem.businessTypeName" @click="businessTypeShow = true"
                               disabled />
                    <van-field is-link label="快递公司" v-model="formItem.logisticsName" @click="logisticsShow = true" />
                    <van-action-sheet v-model="logisticsShow" :actions="logisticsActions" :close-on-click-overlay="true"
                                      @select="logisticsSelect" />
                    <van-field
                        v-model="formItem.deliveryKey"
                        ref="deliveryKey"
                        id="deliveryKey"
                        name="交接号"
                        label="交接号"
                        placeholder="交接号"
                        @keyup.enter.native="searchDeliveryKeyData"
                        @focus="deliveryKeyFocusClick"
                        @click="deliveryKeyFocusClick"
                        :readonly="deliveryKeyReadOnly"
                        :rules="[{required: true, message: '请扫描交接号'}]"
                    />

                    <van-field
                        v-model="formItem.waybillNo"
                        ref="waybillNo"
                        id="waybillNo"
                        name="快递单号"
                        label="快递单号"
                        placeholder="快递单号"
                        @keyup.enter.native="searchWaybillNoData"
                        @focus="waybillNoFocusClick"
                        @click="waybillNoFocusClick"
                        :readonly="waybillNoReadOnly"
                        :rules="[{required: true, message: '请扫描快递单号'}]"
                    />
                    <div style="text-align: center;" v-if="printIf">
                        <van-button type="primary">打印交接清单</van-button>
                    </div>
                </van-form>
            </van-col>
        </van-row>
        <van-row style="margin-top: 0.5rem;" type="flex" justify="center">
            <van-col>
                <van-field :value="sumInfo" readonly></van-field>
            </van-col>
        </van-row>
        <audio ref="successAudio">
            <source src="../../../../../assets/sound/success.mp3" />
        </audio>
        <audio ref="errorAudio">
            <source src="../../../../../assets/sound/error.mp3" />
        </audio>
    </div>
</template>
<script>
    import { getDictSelect } from "@/api/common/selectData";
    import { mapGetters } from "vuex";
    import {
        getHandOverPdaData
    } from "@/api/handOver/handOver.js";

    export default {
        name: "b2cBandOver",
        computed: {
            ...mapGetters("user", ["userData"]),
            ...mapGetters("scanner", ["pdaScanData"])
        },
        watch: {
            pdaScanData: {
                handler(data) {
                    let input = document.activeElement.id;
                    if (input == "deliveryKey") {
                        this.formItem.deliveryKey = data.data;
                        this.searchDeliveryKeyData();
                    } else if (input == "waybillNo") {
                        this.formItem.waybillNo = data.data;
                        this.searchWaybillNoData();
                    }
                },
                deep: true
            }
        },
        created() {
            // 获取当前登录用户名
            this.user = this.userData.sysUserLoginName;
            // 获取货主/仓库/品牌
            if (this.$root.storerWarehouseBrand.storerId === undefined) {
                this.$notify({ type: "warning", message: "请重新登录，并设置货主、仓库、品牌!" });
            } else {
                //快递公司下拉框数据查询方法
                this.onStorerSelect();
            }
            this.deliveryKeyFocus();
        },
        data() {
            return {
                isStatus: false,
                user: "",
                storerId: "",
                wareHouseId: "",
                brandId: "",
                businessTypeShow: false,
                logisticsShow: false,
                logisticsActions: [],
                formItem: {
                    businessTypeName: "B2C",
                    //businessTypeCode: "1259777506696974337",
                    logisticsName: "",
                    logisticsCode: "",
                    deliveryKey: "",
                    waybillNo: ""
                },
                printIf: false,
                holdUpIf: false,
                holdUp: "拦截",
                deliveryList: [],
                deliveryKeyReadOnly: false,
                waybillNoReadOnly: false,
                //按钮的刷新动作
                buttonLoading: {
                    //刷新完成按钮加载
                    refreshCombinedLoading: false,
                    //交接完成按钮加载
                    handoverCompleteLoading: false,
                    //交接重开按钮加载
                    handoverRestartLoading: false
                },
                //按钮禁用
                buttonDisabled: {
                    disabled1: true,
                    disabled2: true
                },
                //负数选框
                delChecked: false,
                //查询的总箱数
                totalCartons: 0,
                //查询的总数量
                totalNum: 0,
                //显示总箱数和总数量
                sumInfo: "",
                //交接明细的接收数组
                handOverScanData: []
            };
        },
        methods: {
            // 播放成功提示声
            playSuccessSound() {
                this.$refs["successAudio"].play();
            },
            // 播放错误提示声
            playErrorSound() {
                this.$refs["errorAudio"].play();
            },

            //查询出此货主对应的快递公司的数据logistics_code grantType: "logistics_code",
            onStorerSelect() {
                getDictSelect(
                    this.$root.storerWarehouseBrand.storerId,
                    this.$root.storerWarehouseBrand.warehouseId,
                    this.$root.storerWarehouseBrand.brandId,
                    this.userData.userId
                ).then(response => {
                    if (response.data.status) {
                        let data = {};
                        this.logisticsActions = [];
                        for (let i = 0; i < response.data.data.length; i++) {
                            if (response.data.data[i].grantType == "logistics_code" && response.data.data[i].grantValue != "全部") {
                                data = {
                                    name: response.data.data[i].grantValue,
                                    code: response.data.data[i].grantKey
                                };
                                this.logisticsActions.push(data);
                            }
                        }
                        this.$notify({ type: "success", message: "快递公司数据加载完成!" });
                        this.deliveryKeyFocus();
                        this.formItem.logisticsName = this.logisticsActions[0].name;
                        this.formItem.logisticsCode = this.logisticsActions[0].code;
                    } else {
                        this.$notify({ type: "warning", message: response.data.message });
                    }
                });
            },
            logisticsSelect(item) {
                this.logisticsShow = false;
                //Toast(item.name);
                this.formItem.logisticsName = item.name;
                this.formItem.logisticsCode = item.code;
                this.deliveryKeyFocus();
            },
            //扫描快递单号时查询方法
            searchWaybillNoData() {
                // 验证货主/仓库/品牌
                if (this.$root.storerWarehouseBrand.storerId === undefined) {
                    this.$notify({ type: "warning", message: "请重新登录，并设置货主、仓库、品牌!" });
                    return;
                }
                if (this.formItem.logisticsCode == null || this.formItem.logisticsCode == "") {
                    this.$notify({ type: "warning", message: "请等待快递公司数据加载完成!" });
                    return;
                }
                if (this.formItem.deliveryKey == null || this.formItem.deliveryKey == "") {
                    this.$notify({ type: "danger", message: "交接号不能为空!" });
                    return;
                }
                if (this.formItem.waybillNo == null || this.formItem.waybillNo == "") {
                    this.$notify({ type: "danger", message: "快递单号不能为空!" });
                    return;
                }
                getHandOverPdaData(
                    this.formItem.businessTypeName,
                    this.formItem.logisticsCode,
                    this.formItem.deliveryKey,
                    this.formItem.waybillNo,
                    this.user
                ).then(response => {
                    //每次扫完后清空快递单号输入框值并且光标定位到快递单号
                    this.formItem.waybillNo = "";
                    this.waybillNoFocus();
                    if (response.data.status) {
                        this.playSuccessSound();
                        this.handOverScanData = [];
                        //查询的总箱数
                        this.totalCartons = 0;
                        //查询的总数量
                        this.totalNum = 0;
                        this.handOverScanData = response.data.data.data;
                        this.totalCartons = Number(response.data.data.totalCartons);
                        this.totalNum = Number(response.data.data.totalNum);
                        this.sumInfo = "总箱数 " + this.totalCartons + "\t总数量 " + this.totalNum;
                        this.$notify({ type: "success", message: response.data.message });
                    } else {
                        this.playErrorSound();
                        if (response.data.code == 500) {
                            this.handOverScanData = [];
                            //查询的总箱数
                            this.totalCartons = 0;
                            //查询的总数量
                            this.totalNum = 0;
                            this.handOverScanData = response.data.data.data;
                            this.totalCartons = Number(response.data.data.totalCartons);
                            this.totalNum = Number(response.data.data.totalNum);
                            this.sumInfo = "总箱数 " + this.totalCartons + "\t总数量 " + this.totalNum;
                        }
                        if (response.data.code == 401) {  //快递公司不符合 提示信息停留时间增加为5s
                            this.$notify({
                                type: "warning",
                                message: response.data.message,
                                duration: 5000
                            });
                        } else {
                            this.$notify({ type: "warning", message: response.data.message });
                        }
                    }
                });
            },
            searchDeliveryKeyData() {
                // 验证货主/仓库/品牌
                if (this.$root.storerWarehouseBrand.storerId === undefined) {
                    this.$notify({ type: "warning", message: "请重新登录，并设置货主、仓库、品牌!" });
                    return false;
                }
                if (this.formItem.deliveryKey == "") {
                    this.$toast.fail("交接号不能为空");
                    this.deliveryKeyFocus();
                } else {
                    this.waybillNoFocus();
                }
            },
            waybillNoFocus() {
                this.$nextTick(() => {
                    this.$refs["waybillNo"].focus();
                });
            },
            deliveryKeyFocus() {
                this.sumInfo = "总箱数 " + this.totalCartons + "\t总数量 " + this.totalNum;
                this.$nextTick(() => {
                    this.$refs["deliveryKey"].focus();
                });
            },
            waybillNoFocusClick() {
                this.waybillNoReadOnly = true;
                setTimeout(() => {
                    this.waybillNoReadOnly = false;
                }, 200);
            },
            deliveryKeyFocusClick() {
                this.deliveryKeyReadOnly = true;
                setTimeout(() => {
                    this.deliveryKeyReadOnly = false;
                }, 200);
            },
            onClickLeft() {
                this.$router.go(-1);
            }
        }
    };
</script>

<style lang="less">
    .wrapper {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 100%;
    }

    .msgTxt {
        margin: 8px 83px 0;
        font-size: 18px;
        color: white;
    }
</style>
